<template>
	<view>
		<!-- tabs -->
		<u-tabs :list="tabList" :is-scroll="true" :current="current" @change="change"></u-tabs>
		<u-card v-if="orderList.length>0" v-for="(item,index) in orderList" :key='index' :title="item.title" :sub-title="item.createtime" >
			<view class="card_view" slot="body">
				<view><text class="titlee">土地面积</text>：{{item.mianji}}</view>
				<view><text class="titlee">单价</text>：{{item.price}}</view>
				<view><text class="titlee">共计费用</text>：{{item.money}}</view>
				<view><text class="titlee">定金</text>：{{item.ding_money}}</view>
				<view v-if="item.ding_image"><text class="titlee">定金凭证</text>：<image :src="item.ding_image" style="width:100rpx;height:100rpx;"></image></view>
				<view><text class="titlee">尾款</text>：{{item.wei_money}}</view>
				<view v-if="item.wei_image"><text class="titlee">尾款凭证</text>：<image :src="item.wei_image" style="width:100rpx;height:100rpx;"></image></view>
				<view><text class="titlee">耕作要求</text>：{{item.yaoqiu}}</view>
				<view @click="call(item.phone)"><text class="titlee">农户电话</text>：{{item.phone}}<u-icon name="phone-fill" color="#4bbb89" style="margin-left:10rpx;"></u-icon></view>
				<view @click="goAddress(item.address)"><text class="titlee">地址</text>：{{item.address}}<u-icon name="map-fill" color="#4bbb89" style="margin-left:10rpx;"></u-icon></view>
				<view v-if="item.status==1"><text class="titlee">状态</text>：{{item.work_status_text1}}</view>
			</view>
			<view class="" slot="foot" v-if="item.work_status==2">
				<button class="btn1" @click="startWork(item.id)">开始工作</button>
			</view>
			<view class="" slot="foot" v-if="item.work_status==3">
				<button class="btn1" @click="finishWork(item.id)">确认工作完成</button>
			</view>
			<view class="" slot="foot" v-if="item.work_status==7">
				<button class="btn1" @click="jieWork(item.id)">确认结算完成</button>
			</view>
		</u-card>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				page:1,
				limit:10,
				total:0,
				tabList:[],
				tabListValue:[],
				orderList:[],
				current: 0,
				index:0,
			}
		},
		onLoad() {
			this.getTab();
		},
		onShow() {
			this.orderList = [];
			this.page =1;
			this.getList(1);
		},
		onReachBottom() {
			if(this.orderList.length<this.total){
				this.getList();
			}
		},
		methods: {
			//tab
			getTab(){
				var _this = this;
				_this.$http('apply.njs_tab',{}).then(res=>{
					var data = res.data;
					data.forEach(item=>{
						_this.tabList.push({'name':item.label});
						_this.tabListValue.push(item.value);
					})
				})
			},
			getList(num){
				var _this = this;
				_this.$http('apply.njs_order',{
					page:num?num:_this.page,
					limit:_this.limit,
					index:_this.index
				}).then(res=>{
					_this.orderList = _this.orderList.concat(res.data.list);
					_this.total = res.data.total;
					_this.page++;
				})
			},
			//切换标签
			change(index) {
				this.current = index;
				this.index = this.tabListValue[index];
				this.orderList = [];
				this.page =1;
				this.getList(1);
			},
			//开始工作
			startWork(id){
				var _this = this;
				_this.$http('apply.njs_changeWorkStatus',{
					work_id:id,
					work_status:3
				}).then(res=>{
					if(res.code == 1){
						uni.showToast({
							title:'操作成功',
							icon:'none'
						})
						_this.orderList = [];
						_this.page =1;
						_this.getList(1);
					}else{
						uni.showToast({
							title:res.msg,
							icon:'none'
						})
					}
				})
			},
			//确认工作完成
			finishWork(id){
				var _this = this;
				_this.$http('apply.njs_changeWorkStatus',{
					work_id:id,
					work_status:4
				}).then(res=>{
					if(res.code == 1){
						uni.showToast({
							title:'操作成功',
							icon:'none'
						})
						_this.orderList = [];
						_this.page =1;
						_this.getList(1);
					}else{
						uni.showToast({
							title:res.msg,
							icon:'none'
						})
					}
				})
			},
			//确认结算完成
			jieWork(id){
				var _this = this;
				_this.$http('apply.njs_changeWorkStatus',{
					work_id:id,
					work_status:8
				}).then(res=>{
					if(res.code == 1){
						uni.showToast({
							title:'操作成功',
							icon:'none'
						})
						_this.orderList = [];
						_this.page =1;
						_this.getList(1);
					}else{
						uni.showToast({
							title:res.msg,
							icon:'none'
						})
					}
				})
			},
			goAddress(address) {
				uni.request({
					url: 'https://apis.map.qq.com/ws/geocoder/v1/?address=' + address +
						'&key=ULIBZ-LTS3J-HMRFZ-KFRPH-W2E4S-BFFKQ',
					success(res) {
						console.log(res);
						uni.openLocation({
							latitude: res.data.result.location.lat,
							longitude: res.data.result.location.lng,
							success(ret) {
			
							}
			
						})
					}
				})
			},
			call(mobile) {
				uni.makePhoneCall({
					phoneNumber: mobile
				})
			}
		}
	}
</script>

<style>
.btn1{
			background-color: #388E3C;
			color: #fff;
		}
</style>
